<template>
  <view :style="{height : pageHeight + 'px'}" class="content">
    <!-- 加载提示 -->
    <tui-loading v-if="loadingTips" :isMask="true"></tui-loading>
    <!-- 操作栏 -->
    <view class="optColumn">
      <view v-if="roles.principal || roles.leader" class="sendGather" @tap="sendNews('gather')">
        发起集合
      </view>
      <view v-if="roles.principal || roles.leader" class="sendNotice" @tap="sendNews('notice')">
        发起通知
      </view>
    </view>
    <!-- 集合消息列表-->
    <view class="gatherList">
      <view class="listTitle">
        集合消息
      </view>
      <view class="itemList">
        <scroll-view v-if="gatherList.length>0" class="itemList" lower-threshold="10rpx" scroll-y="true"
                     @scrolltolower="getMoreNotice">
          <view v-for="(item,index) in gatherList" :key="index" class="itemBox">
            <view class="gatherItem" @tap="toGatherDetail(item,index)">
              <view class="itemContent">
                <view class="contentValue">
                  {{ item.messageAssemble.headline }}
                </view>
                <view class="sendTime">
                  时间: {{ item.messageAssemble.createTime }}
                </view>

              </view>
              <view class="itemIcon">
                <view v-if="item.messageAssemble.isRead === 0" class="newsBadge">
                  <tui-badge :scaleRatio="1.5" dot type="danger"></tui-badge>
                </view>
                <view class="icon">
                  >
                </view>
              </view>
            </view>
          </view>
        </scroll-view>
        <!-- 无内容 -->
        <view v-else class="noData">
          暂无内容
        </view>
      </view>
    </view>

    <!-- 通知消息列表 -->
    <view class="noticeList">
      <view class="listTitle" style="background-color: #FF9802;">
        通知消息
      </view>
      <view class="itemList">
        <scroll-view v-if="noticeList.length>0" class="itemList" lower-threshold="10rpx" scroll-y="true"
                     @scrolltolower="getMoreNotice">
          <view v-for="(item,index) in noticeList" :key="index" class="itemBox">
            <view class="gatherItem" style="background-color: #FFF9F0;" @tap="toNoticeDetail(item,index)">
              <view class="itemContent">
                <view v-if="item.messageAssemble.type ===2" class="contentValue">
                  {{ item.messageAssemble.headline }}
                </view>
                <view v-else class="contentValue">
                  行程通知
                </view>
                <view class="sendTime">
                  时间: {{ item.messageAssemble.createTime }}
                </view>
              </view>
              <view class="itemIcon">
                <view v-if="item.messageAssemble.isRead === 0" class="newsBadge">
                  <tui-badge :scaleRatio="1.5" dot type="danger"></tui-badge>
                </view>
                <view class="icon">
                  >
                </view>
              </view>
            </view>
          </view>
        </scroll-view>
        <!-- 无内容 -->
        <view v-else class="noData">
          暂无内容
        </view>
      </view>
    </view>
    <zy-modal></zy-modal>
  </view>
</template>

<script>
import {
  queryAssembleList,
  queryByUserPhoneMessageList
} from '@/api/tourplan.js'

export default {
  data() {
    return {
      pageHeight: 750,
      pageParams: {
        page: 1,
        size: 10,
        total: 0,
      },
      roles: {},
      itineraryId: 0,
      gatherList: [],
      noticeList: [],
      loadingTips: false,
      groupId: null,
      proposalId: 0, //行程id
    }
  },
  onLoad: function (options) {
    const that = this
    uni.getSystemInfo({
      success: function (res) {
        that.pageHeight = res.windowHeight
      }
    });
    that.initData(options)
  },
  onShow() {
    const that = this
    that.loadingTips = true
    //数据更新时清除原有数据，获取最新数据
    that.gatherList = []
    that.noticeList = []
    that.pageParams.page = 1
    that.getNoticeList()
  },
  onUnload() {
  },
  methods: {
    //初始化数据
    initData(options) {
      const that = this
      const rolesJSON = decodeURIComponent(options.roles)
      that.roles = JSON.parse(rolesJSON)
      that.itineraryId = options.itineraryId
      that.groupId = options.groupId
      that.proposalId = options.proposalId
    },

    //获取消息列表
    getNoticeList() {
      const that = this
      // if (that.roles.principal) {
      // 	queryAssembleList({
      // 		phone: uni.getStorageSync("userinfo").phone,
      // 		itineraryId: that.itineraryId,
      // 		page: that.pageParams.page,
      // 		size: that.pageParams.size,
      // 		groupId: that.groupId
      // 	}).then(res => {
      // 		that.pageParams.total = res.total
      // 		for (let i = 0; i < res.records.length; i++) {
      // 			if (res.records[i].type === 1) {
      // 				that.gatherList.push(res.records[i])
      // 			} else {
      // 				that.noticeList.push(res.records[i])
      // 			}
      // 		}
      // 		that.loadingTips = false
      // 	}).catch(err => {
      // 		that.loadingTips = false
      // 		uni.showToast({
      // 			title: err.error,
      // 			icon: 'none',
      // 			duration: 3000
      // 		})
      // 	})
      // } else {
      queryByUserPhoneMessageList({
        page: that.pageParams.page,
        size: that.pageParams.size,
        phone: uni.getStorageSync("userinfo").phone,
        itineraryId: that.itineraryId,
        groupId: that.groupId
      }).then(res => {
        that.pageParams.total = res.total
        for (let i = 0; i < res.records.length; i++) {
          if (res.records[i].messageAssemble.type === 1) {
            that.gatherList.push(res.records[i])
          } else {
            that.noticeList.push(res.records[i])
          }
        }
        that.loadingTips = false
      }).catch(err => {
        that.loadingTips = false
        uni.showToast({
          title: err.msg,
          icon: 'none',
          duration: 3000
        })
      })
      // }
    },

    //获取更多--消息
    getMoreNotice() {
      const that = this
      if (that.noticeList.length + that.gatherList.length < that.pageParams.total) {
        that.pageParams.page++
        that.getNoticeList()
      } else {
        uni.showToast({
          title: '没有更多啦！',
          icon: 'none',
          duration: 3000,
        })
      }
    },
    //获取更多--通知
    getMoreGather() {

    },
    //发起消息
    sendNews(type) {
      const that = this
      if (that.roles.leader || that.roles.principal) {
        uni.navigateTo({
          url: `/pages/tourplan/noticeGather/sendNews/sendNews?itineraryId=${that.itineraryId}&type=${type}&roles=${encodeURIComponent(JSON.stringify(that.roles))}&groupId=${that.groupId}`
        })
      } else {
        //用户提示无权限
        uni.showToast({
          title: '您没有该权限',
          icon: 'none',
          duration: 3000
        })
      }

    },

    //查看集合消息详情
    toGatherDetail(item, index) {
      const that = this
      uni.navigateTo({
        url: 'gatherDetail/gatherDetail?dataGather=' + encodeURIComponent(JSON.stringify(item)) +
            '&roles=' + encodeURIComponent(JSON.stringify(that.roles)) + '&groupId=' + that.groupId +
            '&itineraryId=' + that.itineraryId + '&proposalId=' + that.proposalId
      })
    },
    //查看通知消息详情
    toNoticeDetail(item, index) {
      console.log(item)
      const that = this
      uni.navigateTo({
        url: 'noticeDetail/noticeDetail?dataNotice=' + encodeURIComponent(JSON.stringify(item)) +
            '&groupId=' + that.groupId
      })
    }
  }
}
</script>
<style>
@import url('noticeGather.css');
</style>
